<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <span id="shijian"></span>
    <span id="guding"></span>

    <script src="utils.js"></script>
    <script>
        // 先给两个时间计算两个时间的差
        var date1 = new Date('2020-06-20 12:00:00');
        var date2 = new Date('2020-08-11 00:00:00');
        // 调用已经封装好的函数，回调函
        chaTime(date1, date2, function(obj) {
                shijian.innerHTML = '这两个时间相差多' + obj.day + '天' + obj.hours + '时' + obj.minutes + '分' + obj.seconds + '秒'
            })
            // 用定时器加倒计时
        setInterval(function() {
            date2 = new Date();
            chaTime(date1, date2, function(obj) {
                shijian.innerHTML = '这两个时间相差多' + obj.day + '天' + obj.hours + '时' + obj.minutes + '分' + obj.seconds + '秒'
            })
        }, 1000)
        var date3 = new Date('2020-07-09 12:34:56')
        var date4 = new Date('2020-09-09 15:34:12')
        setInterval(function(value) {
            chaTime(date1, date2, function(value) {
                guding.innerHTML = '在页面停留了' + value.day + '天' + value.hours + '时' + value.minutes + '分' + value.seconds + '秒'
            })
        }, 1000)
    </script>
</body>

</html>